 .chat_room {
     width: 100%;
     display: flex;
     flex-direction: column;
 }

 .chat_content {
     width: 98%;
     /* flex: 1; */
     overflow: auto;
 }

 .chat_op {
     width: 100%;
     height: 40px;
     line-height: 40px;
     position: fixed;
     bottom: 0;
     left: 0;
     background-color: #fff;
 }

 .chat_op_input {
     width: 50%;
     height: 30px;
     border: 1px solid #ccc;
     border-radius: 5px;
     padding: 0 5px;
     box-sizing: border-box;
 }

 .chat_op_btn1 {
     width: 13%;
     height: 30px;
     line-height: 30px;
     border: 1px solid #ccc;
     border-radius: 5px;
     margin-left: 5px;
     box-sizing: border-box;
     background-color: #245aed;
     color: #fff;
 }

 .chat_op_btn2 {
     width: 13%;
     height: 30px;
     line-height: 30px;
     border: 1px solid #ccc;
     border-radius: 5px;
     margin-left: 5px;
     box-sizing: border-box;
     background-color: #245aed;
     color: #fff;
 }

 .me_item {
     text-align: right;
     margin-left: 200px;
     display: flex;
     justify-content: flex-start;
     /* 让消息整体从左到右排列 */
     height: 60px;
     display: inline-block;
 }

 .me_item img {
     width: 50px;
     height: 50px;
     border-radius: 50%;
     vertical-align: middle;
     margin-left: 10px;
 }

 .me {
     background: #b0d1f9;
     border: 1px solid #b0d1f9;
     height: 40px;
     display: inline-block;
     border-radius: 10px;
     line-height: 40px;
 }

 .friedns_item {
     text-align: left;
     margin-left: 20px;
     height: 60px;
 }

 .friedns_img {
     width: 50px;
     height: 50px;
     border-radius: 50%;
     vertical-align: middle;
     /* margin-right: 10px; */
 }

 .friedns {
     background: #b0d1f9;
     border: 1px solid #b0d1f9;
     height: 40px;
     display: inline-block;
     border-radius: 10px;
     line-height: 40px;
 }
 .chat_nav{
    position: sticky;
    top: 0;
    z-index: 9999;
    background: #fff;
}